<script setup lang="ts">
import { onMounted } from 'vue';

onMounted(() => {

  //动态配置主题色
  const options = {
    disableSearch:false,
    hideDownloadButton:false,
    minCharacterLengthToInitSearch:2,
    hideLoading:false,
    hideSchemaTitles:false,
    hideSecuritySection:false,
    theme: {
      spacing: {
        unit: "5",
        // sectionHorizontal: "25",
        // sectionVertical: "5",
      },
      sidebar: {
        backgroundColor: "lightblue",
      },
      rightPanel: {
        backgroundColor: "pink",
      },
    },
  };

  Redoc.init('http://petstore.swagger.io/v2/swagger.json', options, document.getElementById('redoc-container'))

})

</script>

<template>
  <div>
    <!-- <H1>Redoc in action</H1> -->
    <div id="redoc-container"></div>
  </div>

</template>

<style scoped></style>
